<template>
  <el-drawer
    :visible.sync="visible"
    :modal-append-to-body="true"
    :append-to-body="true"
    :destroy-on-close="false"
    :modal="true"
    :show-close="false"
    direction="rtl"
    :wrapperClosable="false"
    :withHeader="false"
    custom-class="form-drawer"
    size="100%"
    @closed="closed"
    >
    <div class="form-drawer__content">
      <div id="goHome" class="goHome-button">
        <a class="btn goHome-img boxSizing"   @click="handleClose()"><span class=" el-icon-close"></span></a>
      </div>

    </div>
  </el-drawer>
</template>

<script>

  import {
    saveScene,
    getSceneTypes
  } from '@/api/biz/scene'
  export default {
    name: 'PreviewDrawer',
    components: {
    },
    props: {
      properties: {
        type: Object,
        default: () => ({})
      }
    },
    computed:{

    },
    watch:{
      properties: {
        handler: function(value) {
          this.visible = value.visible
          if (value.data) {
            this.formData.id = value.data.id || ''
            this.formData.name = value.data.name || ''
            this.formData.remark = value.data.remark || ''
            this.formData.version = value.data.version || 0.00
          } else {
            this.formData.id =''
            this.formData.name = ''
            this.formData.size = 0.00
            this.formData.version =0.00
          }
        },
        immediate: true,
        deep: false
      }
    },
    data(){
      return {
        visible:false,
        loading:false,
        formData: {
          id: '',
          name: '',
          size:0.00,
          version:0.00,
        },
      }
    },
    created() {
    },
    methods:{
      handleClose(done) {
        this.$confirm('确认要退出预览？')
          .then(_ => {
             this.loading = false;
             this.visible = false;
          })
          .catch(_ => {});
      },
      closed: function() {
        this.$emit('closed', false)
      },
    }
  }

</script>


<style lang="scss" scoped>

  .goHome-button {
      right: 0;
      top: 0;
      z-index: 210;
      width: 36px;
      height: 36px;
      background: linear-gradient(51deg,#043149,#23430e);
      background: -webkit-linear-gradient(51deg,#043149,#23430e);
      border-bottom-left-radius: 36px;
      position: fixed;
      z-index: 200;
      padding-left: 5px;
      text-align: center;
      line-height: 36px;
      color: white;
      font-weight: 400;
      font-size: 1.1rem;
  }

</style>
